<link rel="stylesheet" href="../css/swiper.css">
<script src="../script/swiper.js"></script>
<style>
    .m-swiper {
        background: #000;
    }

    /* 轮播 */
    .swiper-slide {
        height: calc(100vh - 46px);
        display: flex;
        align-items: center;
    }

    .swiper-container {
        overflow: hidden;
    }

    .swiper-slide img {
        width: 100%;
    }

    /* 分页器 */
    .swiper-pagination-fraction,
    .swiper-pagination-custom,
    .swiper-container-horizontal>.swiper-pagination-bullets {
        color: #fff;
        font-size: 12px;
    }

    .swiper-pagination-bullet {
        width: 4px;
        height: 4px;
    }
</style>
<div id="view">

    <div class="m-swiper">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide" v-for="(m, index) in ffList">
                    <img :src="imgurl + m">
                </div>
                <!-- <div class="swiper-slide">
                        <img src="../image/test/01.jpg">
                    </div> -->
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </div>
</div>
<script>
    var view = new Vue({
        el: '#view',
        data: {
            imgurl: imgurl,
            ffList: [],
        }
    })
    var imgIndex = pageParam['iIndex'] || 0;
    initImg()
    judgeLogin()

    function initImg() {
        var imgArr = pageParam['imgArr'];
        view.ffList = imgArr.split(',');
        setTimeout(function () {
            var swiper = new Swiper('.swiper-container', {
                initialSlide: parseInt(imgIndex),
                loop: true,
                pagination: {
                    el: '.swiper-pagination',
                    clickable: true,
                    type: 'fraction',
                },
            });
        }, 300)
    }
</script>